<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thylemeaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">

    <script src="js/jquery-3.4.1.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>

    <link href="css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="./layui/css/layui.css">
    <link rel="stylesheet" href="css/indexCss3.css">
    <link rel="stylesheet" href="css/fotter.css" />

    <title>有个名字叫智能汽车</title>


    <style>
        a:hover{text-decoration: none;}
    </style>


    <script>

        /*
         * 读取参数的值
         */
        function getParameter(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = location.search.substr(1).match(reg);
            if (r != null) return (r[2]);
            return null;
        }

        /*
            查看商品时，携带Id
         */
        function enterAnnounce(id){
            window.location.href="ShowSmart.html?id="+id;
        }

        $(function () {

            /*
                搜索
            */
            $("#seekBtn").click(function () {
                smart(1,$("#seekEditText").val());
                return false;
            });

            /*
                是否登录
            */
            $.ajax({
                // 编写json格式，设置属性和值
                url: "user/findUser",
                contentType: "application/json;charset=UTF-8",
                data: '',
                dataType: "json",
                type: "post",
                success: function (data) {
                    if (!data.phone) {
                        $("#dis1")[0].style.display = "block";
                        $("#dis2")[0].style.display = "block";
                        $("#dis3")[0].style.display = "none";
                    } else {
                        $("#dis1")[0].style.display = "none";
                        $("#dis2")[0].style.display = "none";
                        $("#dis3")[0].style.display = "block";
                    }
                }
            })

            var othersFlag = false;
            $("#showOthers").click(function () {
                if (othersFlag == false) {
                    othersFlag = true;
                    $("#others")[0].style.display = "block";
                } else {
                    othersFlag = false;
                    $("#others")[0].style.display = "none";
                }
            })

            smart(sessionStorage.getItem("page2")!=null?sessionStorage.getItem("page2"):1,null);

        })

        function smart(page,title) {

            sessionStorage.setItem("page2",page);

            $.ajax({
                // 编写json格式，设置属性和值
                url: "smart/query",
                data: {title:title,page:page},
                type: "post",
                success: function (data) {
                    if (data != null) {
                        $("#domain").empty();
                        for (var i = 0; i < data.list.length; i++) {
                            $("#domain").append('<div class="col-sm-3 product" onclick="enterAnnounce('+data.list[i].id+')"> ' +
                                '<div class="thumbnail image-hover img-shadow-1"> ' +
                                '<img style="width: 250px;height: 200px;" src="' + data.list[i].imgs[0].path + '"/> ' +
                                '<p class="titleP" style="font-size: 16px;color: black;">' + data.list[i].title + '</p> ' +
                                '<span style="color: #8D8D8D">车速'+data.list[i].maxSpeed+'h/km | '+data.list[i].num+'座位</span>' +
                                '</br>' +
                                '<font color="red" style="font-size: 20px;">￥' + data.list[i].money + '</font> ' +
                                '</div> ' +
                                '</div>');
                        }


                        $("#paging").empty();

                        if (data.pageNum == 1)
                            $("#paging").append('<li class="page-item disabled"><a class="page-link" >上一页</a></li>');
                        else
                            $("#paging").append('<li class="page-item" onclick="smart('+(data.pageNum-1)+',null)" ><a class="page-link" >上一页</a></li>');

                        if (data.total != 0) {
                            var begin;
                            var end;
                            if (data.pages < 5) {
                                begin = 1;
                                end = data.pages;
                            } else {
                                begin = pageNum - 2;
                                end = pageNum + 2;

                                if (begin <= 0) {
                                    begin = 1;
                                    end = 5;
                                }

                                if (end > data.pages) {
                                    begin = data.pages - 4;
                                    end = data.pages;
                                }

                            }
                            

                            for (var i = begin; i <= end; i++) {
                                if (data.pageNum == i)
                                    $("#paging").append('<li class="page-item active"><a class="page-link">' + i + '页</a></li>');
                                else
                                    $("#paging").append('<li class="page-item" onclick="smart('+i+',null)" ><a class="page-link">' + i + '页</a></li>');
                            }

                        } else {//如果一条数据都没有则显示只有一页
                            $("#paging").append('<li class="page-item active"><a class="page-link" >1</a></li>');
                        }

                        if (data.pageNum == data.pages)
                            $("#paging").append('<li class="page-item disabled"><a class="page-link" >下一页</a></li>');
                        else
                            $("#paging").append('<li class="page-item" onclick="smart('+(data.pageNum+1)+',null)" ><a class="page-link" >下一页</a></li>');

                    }
                }

            });
        }


    </script>


</head>

<body>

<div th:replace="header::#nav(activeUrl='index03.html')"></div>

<!--<nav class="navbar navbar-default" id="nav">-->
<!--    <div class="container-fluid">-->
<!--        <div class="navbar-header layout">-->
<!--            <img id="logoId" src="img/logo2.png"/>-->
<!--            <a class="lin" href="index01.html" >汽车中心</a>-->
<!--            <a class="lin" href="index02.html" id="oneCar">二手汽车</a>-->
<!--            <a class="lin" href="#" id="twoCar">智能汽车</a>-->
<!--        </div>-->

<!--    </div>-->

<!--    <div id="seek_div">-->

<!--        <form class="navbar-form" id="seek_form" >-->
<!--            <input type="text" id="seekEditText" class="form-control" placeholder="查找" >-->
<!--            <button id="seekBtn" class="btn btn-default">搜索</button>-->
<!--        </form>-->

<!--    </div>-->

<!--    <ul class="nav navbar-nav navbar-right" id="login_right">-->
<!--        <li id="dis1" style="display: none"><a href="login.html" class="lin">登录</a></li>-->
<!--        <li id="dis2" style="display: none"><a href="register.html" class="lin">注册</a></li>-->
<!--        <li class="dropdown">-->
<!--            <a id="dis3" style="display: none" href="#" class="dropdown-toggle lin" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">我的	<span class="caret"></span></a>-->
<!--            <ul class="dropdown-menu">-->
<!--                <li><a href="upload.html" class="wode">我要卖车</a></li>-->
<!--                <li><a href="shopCart.html" class="wode">收藏</a></li>-->
<!--                <li><a href="user/logout.do" class="wode">注销</a></li>-->
<!--            </ul>-->
<!--        </li>-->
<!--    </ul>-->

<!--    <div id="tag">-->
<!--        <span id="tag1" >智能汽车</span>-->
<!--        <span id="tag2">给予你最关怀的陪伴。</span>-->
<!--    </div>-->

<!--</nav>-->



<!--轮播图-->
<div class="container-fluid" id="carouselDiv">

    <div id="myCarousel" class="carousel slide imgSize" data-ride="carousel" align="center"
         style="display: inline-block;">

        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner" role="listbox">
            <div class="item active">
                <img src="img/icon1.jpg" alt="...">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="img/icon2.jpg" alt="...">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="img/icon3.jpg" alt="...">
                <div class="carousel-caption"></div>
            </div>
        </div>
    </div>

</div>

<!--主题部分-->
<div class="container" id="shoppingDomain">
    <div class="row jx" id="goods">
        <fieldset class="layui-elem-field layui-field-title site-demo-button" style="margin-top: 30px;">
            <blockquote class="layui-elem-quote">
                最新上架
            </blockquote>
        </fieldset>

    </div>
    <div id="domain">


    </div>
</div>

<!--页脚部分，写作者，图片还有各种介绍-->
<div class="text-center" id="pageId">
    <!--翻页条-->
    <ul class="pagination pagination-lg" id="paging">

    </ul>
</div>

<div th:replace="header::footer"></div>

<script type="text/javascript" src="./layui/layui.all.js"></script>

</body>
</html>